import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/pages/Home'
import About from '@/pages/About'
import News from '@/pages/News'
import Message from '@/pages/Message'
import Detail from '@/pages/Detail'

Vue.use(VueRouter)

export default new VueRouter({
  mode: 'history',
  // routes是route的复数，所以routes中要编写一组一组的路由规则（route）
  routes: [
    {
      name:'zhuye',
      path: '/home',
      component: Home,
      children:[
        {
          name:'xinwen',
          path:'news',
          component:News
        },
        {
          name:'xiaoxi',
          path:'message',
          component:Message,
          children:[
            {
              name:'xiangqing',
              path:'detail/:id/:title/:content',
              component:Detail,
              // 对象写法 —— 将对象中的每一组key-value以props的形式传给Detail组件
              // props:{qweasd:99999,x:'哈哈',y:'嘻嘻'}

              // 函数写法 —— 将函数返回的那个对象中的每一组key-value以props的形式传给Detail组件
              // props({params}){
              //   // return {qweasd:99999,x:'哈哈',y:'嘻嘻'} //去Detail中可以用props去接收：qweasd、x、y
              //   // return params //去Detail中可以用props去接收：params对象中的每一组key-value
              //   return params
              // }

              // 布尔值 —— 将路由收到的params参数中的每一组key-value以props的形式传给Detail组件
              props:true,
            }
          ]
        },
        {
          path:'',
          redirect:'/home/news'
        }
      ]
    },
    {
      name:'guanyu',
      path: '/about',
      component: About
    },
    {
      path:'/', //要么不写，要么写其父级的路径
      redirect:'/about' //最好写完整
    }
  ]
})